<template>
	<div>
		<city-header></city-header>
		<city-list :hotCities="hotCities" :citys='citys'></city-list>
	</div>
</template>

<script>
	import CityHeader from './pages/Header'
	import CityList from './pages/List'
	import axios from 'axios'
	
	export default {
		components:{
			CityHeader,
			CityList
		},
		data(){
			return {
				hotCities : [],
				citys : [],
			}
		},
		mounted() {
			axios.get('./city.json').then((res)=>{
				// console.log(res)
				const data = res.data.data[0];
				this.hotCities = data.hotCities;
				this.citys = data.city;
				
			})
		}
	}
	
</script>

<style>
	.city {
		background-color: #ddd;
	}
</style>
